<template>
	<view>
		
		<view style="height: 140upx;display: flex;border-bottom: 2upx solid #dddddd;border-top: 2upx solid #dddddd;" @click="zfb_pay">
			<view style="width: 160upx;position: relative;">
				<image src="../../../static/function/zfb.png" style="width: 100upx;height: 100upx;margin: 20upx 0 0 30upx;"></image>
				<view style="position: absolute;border: 2upx solid #dddddd;right: 0;top: 30upx;z-index: 33;height: 80upx;width: 0;"></view>
			</view>
			<view style="width: 500upx;margin-left: 30upx;margin-top: 10upx;">
				<view style="height: 70upx;font-size: 36upx;font-weight: 555;">APP支付宝支付</view>
				<view style="height: 70upx;color: #ccc;">支付宝安全支付</view>
			</view>
		</view>
		
	</view>
</template>

<script>
	export default {
		methods: {
			zfb_pay(){
				//请求后台数据(必须) prepay_id paySign nonceStr timeStamp
				uni.request({
					url: 'http://www.tangchaojishi.com/app/index.php?i=2&c=entry&m=ewei_shopv2&do=mobile&r=order.alipay&out_trade_no=' + this.ordersn + '&total_amount=' + this.price + '&goodstitle=' + this.title + '&app=1' ,
					header:{'Content-Type':'application/x-www-form-urlencoded'},
					success: (res) => {
						// 调起支付
						var userinfo = res.data
						var _this = this
						uni.requestPayment({
							provider: 'alipay',
							orderInfo: userinfo, //订单数据
							success: function(res) {
								// 页面的成功与否状态前台不能捕捉,支付成功之后不能写js逻辑和接口逻辑,只能写简单页面跳转逻辑,否则用户可能支付成功之后立马关程序造成 掉单!!!!
								console.log('支付成功----------------------')
								setTimeout(function() {
									_this.alipaymoney()
								}, 10);
							},
							fail: function(err) {
								console.log('支付失败----------------------')
								return
							}
						});
					}
				});
			},
			alipaymoney(){
				// 支付成功跳转支付成功页面
				uni.navigateTo({
					url: 'success/success?id='+this.orderid+'&result='+ 'sure'
				});
			},
		}
	}
</script>

<style>
</style>
